<template>
    <div class="foods">
        <van-empty description="没有商品" v-if="!foodList.length"/>
        <van-card
            :price="food.price"
            :desc="food.description"
            :title="food.name"
            :thumb="food.mainImage"
            v-for="food of foodList"
        >
        <template #footer>
          <van-button size="mini" @click="handleAddCart(food.id)">
           <van-icon name="plus"/>
          </van-button>
        </template>
        </van-card>
    </div>

</template>

<script>
import axios from "axios";
import { showConfirmDialog} from "vant";

export default {
    name: "foods",
    props: ['business'],
    data() {
        return {
            id: '',
            foodList: []
        }
    },
    methods: {
        _initFoodList() {
            axios.get(`http://localhost:8888/ele_server/business/foods?businessId=${this.id}`).then(({data: res}) => {
                if (res.status == 0) {
                    this.foodList = res.data;
                } else {
                    alert(res.message)
                }
            })
    },
    handAddCart(id) {
        axios.get(`/ele_server/cart/add?foodId=${id}&quantity=1`).then(({data: res}) => {
            if (res.status == 0) {
                showConfirmDialog({
                    title: '提示',
                    message: '添加购物车成功',
                    confirmButtonText: '去购物车结算',
                    cancelButtonColor: '继续浏览'
                }).then(() => {
                    this.$router.push('/cart/list');
                }).catch(() => {})
            } else if (res.status == 3003) {
                showConfirmDialog({
                    title: '提示',
                    message: '未登入不能添加购物车',
                    confirmButtonText: '去登入',
                    cancelButtonText: '继续浏览'
                }).then(() => {
                    this.$router.push(`/user/login?redirect=${this.$route.fullPath}`);
                }).catch(() => {})
            } else {

            }
        })
    }
},
    created(){
       this.id = this.$route.query.id;
       this._initFoodList();
    }
}
</script>

<style scoped lang="stylus">
.foods
 >>>.van-card
   .van-card_footer
     display flex
     justify-content flex-end
     align-items center
      .food-count
        margin-left 5px
</style>